<template>
  <div>
    <mt-header title="找回密码" class="title">
      <router-link to="/login" slot="left">
        <mt-button icon="back"></mt-button>
      </router-link>
    </mt-header>
    <div class="littleInterval"></div>
    <form>
      <mt-field label="新密码" placeholder="请输入新密码" v-model="password"></mt-field>
      <mt-field label="重复密码" placeholder="请重复输入密码" v-model="repeatPassword"></mt-field>
      <mt-field label="验证码" placeholder="请输入验证码" v-model="verificationCode"></mt-field>
      <div class="littleInterval"></div>
      <mt-button type="default" size="large" @click.native="commit">确定</mt-button>
    </form>
  </div>
</template>

<script>
  import { Toast } from "mint-ui"
  import axios from "axios"
    export default {
        name: "Changepassword",
      data(){
          return{
            password:'',
            repeatPassword:'',
            verificationCode:''
          }
      },
      methods:{
        commit(){
          if(this.password.trim()==""){
            Toast("新密码不能为空！");
            return;
          }
          if(this.repeatPassword.trim()==""){
            Toast("重复密码不能为空！");
            return;
          }
          if(this.verificationCode.trim()==""){
            Toast("验证码不能为空！");
            return;
          }
          if(this.password.trim()!=this.repeatPassword.trim()){
            Toast("两次输入的密码不一样!");
            return;
          }
          let params=new URLSearchParams();
          params.append("password",this.password);
          params.append("verificationCode",this.verificationCode);
          params.append("phone",this.$route.params.phone);
          params.append("type",this.$route.params.type);
          axios.post("/api/common/changePassword",params).then(res=>{
            if(res.data.code==200){

            }else{
              Toast(res.data.message);
            }
          });
        }
      }
    }
</script>

<style scoped>
  .littleInterval{
    height: 1rem;
    background-color: rgba(169, 169, 169, 0.08);
  }
</style>
